<template>
    <div>
      <a-input v-model="user"/>
      <a-button @click="initWebSocket">连接</a-button>
        <p>
          群发：<a-textarea v-model="msg"/>
        <a-button @click="sendMany">群发</a-button><br/>
        <a-input v-model="to"/>
        <a-button @click="sendOne">单发</a-button>
        </p>
        <div v-html="msg">
          
        </div>
    </div>
</template>

<script>
import SockJS from 'sockjs-client'
import Stomp from 'webstomp-client'
import Socket from '@/util/socket'
import {sendMany,sendOne} from './api'
export default {
  data() {
    return {
      msg:null,
      user:null,
      to:null
    };
  },
  mounted(){
    // if ('WebSocket' in window) {
    //         this.initWebSocket()
    //     } else {
    //         alert('当前浏览器 Not support websocket')
    //     }
  },
  destroyed: function () { // 离开页面生命周期函数              
		this.websocketclose();        
	},   
  methods: {
    sendOne(){
      console.error(this.user,this.msg);
      
       sendOne(this.to,this.msg).then(v=>{
         console.error("发送成功");
         
       })
    },
    sendMany(){
       sendMany(this.msg).then(v=>{
         console.error("发送成功");
         
       })
    },
    initWebSocket: function () {    
      Socket(this.user).register({onopen:this.websocketonopen,onerror:this.websocketonerror,onmessage:this.websocketonmessage,onclose:this.websocketclose})             
		},              
		websocketonopen: function () {                
			console.log("WebSocket连接成功");              
		},              
		websocketonerror: function (e) {                
			console.log("WebSocket连接发生错误");              
		},              
		websocketonmessage: function (e) {                
			console.log(e.data);                // console.log(e);              
		},              
		websocketclose: function (e) {                
			console.log("connection closed (" + e.code + ")");              
		}
  }
};
</script>

<style>
</style>